<template>
	<view class="warpp">
		<u--form :model="form" :rules="rules" ref="uForm1" :errorType="errorType" labelPosition="top" labelWidth="180rpx">
			<u-form-item label="姓名：" prop="name" >
				<u--input placeholder="请输入姓名" v-model="form.name"></u--input>
			</u-form-item>
			<u-form-item label="电话号码：" prop="mobile" >
				<u--input placeholder="请输入电话号码" v-model="form.mobile" type="number"></u--input>
			</u-form-item>
			<u-form-item label="银行卡号：" prop="card" >
				<u--input placeholder="请输入银行卡号" v-model="form.card" type="number"></u--input>
			</u-form-item>
			<u-form-item label="开户行：" prop="hang">
				<u--input placeholder="请输入开户行" v-model="form.hang"></u--input>
			</u-form-item>
			<u-form-item label="提现金额：" prop="money">
				<u--input placeholder="请输入提现金额" v-model="form.money" type="number"></u--input>
			</u-form-item>
			<u-form-item label="备注：" >
				<u--textarea v-model="form.txt" placeholder="请输入留言" ></u--textarea>
			</u-form-item>	
			<view style="margin-top: 42rpx;">
				<u-button type="primary" shape="circle" text="申请提现" color="#FF3233" customStyle="height: 80rpx" throttleTime="800" @tap="btnClick"></u-button>
				<!-- <u-button type="primary" shape="circle" text="重置" color="#FF3233" @click="reset" customStyle="height: 80rpx"></u-button> -->
			</view>
		</u--form>
	</view>
</template>

<script>
	import Auth from '@/utils/auth';
	import Util from '@/utils/util';
	import Alert from '@/utils/alert';
	import Api from '@/utils/api';
	import Rest from '@/utils/rest';
	export default {
		data() {
			return {
				errorType: 'message',
				form: {
					name: '',
					mobile: '',
					card: '',
					hang: '',
					txt: '',
					money:'',
				},
				rules: {
					mobile: [
						{
							required: true,
							message: '请输入手机号码',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change', 'blur']
						},
						{
							// 自定义验证函数，见上说明
							validator: (rule, value, callback) => {
								return this.$u.test.mobile(value);
							},
							message: '手机号码不正确',
							trigger: ['change', 'blur']
						}
					],
					name: [
						{
							required: true,
							message: '请输入姓名',
							trigger: 'change'
						}
					],
					card: [
						{
							required: true,
							message: '请输入银行卡号',
							trigger: 'change'
						}
					],
					hang: [
						{
							required: true,
							message: '请输入开户行',
							trigger: 'change'
						}
					],
					money: [
						{
							required: true,
							message: '请输入提现金额',
							trigger: 'change'
						}
					]
				},
			};
		},
		
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.uForm1.setRules(this.rules)
		},
		methods: {
			btnClick() {
				uni.$u.debounce(this.submit, 800)
			}, 
			submit() {
				
				let that = this
				this.$refs.uForm1.validate().then(res => {
					Rest.post(Api.ZHUIGE_My_WalletForm, this.form).then(res => {
						
						if(res.code==0){
							uni.$u.toast('提现成功')
							//that.reset()
							this.navTo('/inside/my/wallet') 
						}else{
							uni.$u.toast(res.msg)
						}
					}, err => {
						console.log(err)
					});
				}).catch(errors => {
					uni.$u.toast('校验失败')
				})
			},
			navTo(url) {
				Util.openLink(url)
			},
			reset() {
				this.form={
					name: '',
					mobile: '',
					card: '',
					hang: '',
					txt: '',
					money:'',
				}
			}
		}
	}
</script>

<style lang="scss">
.warpp {
	padding: 32rpx 40rpx;
}
</style>
